<template>
    <view class="container">
		<view class="vip-card-box" style="background-image: url(/static/images/yuebao_box_bg.png);background-size: 100% 100%;">
			<view class="text-center">
				<view class="text-white padding-sm">总金额（元）</view>
				<view class="text-white">
					<text class="text-xxlx">{{ user_yuebao.money }}</text>
				</view>
			</view>
			<view class="cu-list grid col-3 no-border">
				<view class="cu-item margin-top-sm">
					<view class="text-white text-sm">每日收益（元）</view>
					<view class="text-xl text-white">{{ user_yuebao.today_money }}</view>
				</view>
				<view class="cu-item margin-top-sm">
					<view class="text-white text-sm">累计收益（元）</view>
					<view class="text-xl text-white">{{ user_yuebao.all_interest }}</view>
				</view>
				<view class="cu-item margin-top-sm">
					<view class="text-white text-sm">24小时利率（%）</view>
					<view class="text-xl text-white">{{ user_yuebao.yuebao_rate }}</view>
				</view>
			</view>
			<view class="cu-list grid col-2 no-border">
				<view class="cu-item" @click="navToUrl('/pages/yuebao/chu_list')">
					<button class="round bg-red text-white">转出</button>
				</view>
				<view class="cu-item" @click="navToUrl('/pages/yuebao/ru')">
					<button class="round bg-white text-red">转入</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
    export default {
		data() {
			return {
				userinfo:[],
				user_yuebao:[]
			};
		},
		onLoad: function (option) {
			this.helper.checkLogin();
			this.getData();
			this.loadData();
		},
		onNavigationBarButtonTap(val) {
			uni.navigateTo({
				url: '/pages/help/other?type=yuebao',
			});	
		},
		methods: {
			getData:function(){
				//获取基础参数
				// uni.showLoading({
				// 	title:"数据加载中",
				// 	mask:true
				// })
				var info = uni.getStorageSync("userinfo");
				let timestamp = this.helper.now();
				let sign = this.helper.setSign(['username='+info.username,'token='+info.token,'timestamp='+timestamp]);
				this.helper.req({
					api:"getUserInfo",
					timestamp:timestamp,
					data:{username:info.username,token:info.token},
					header:{sign:sign},
					method:'GET',
				}).then(res=>{
					this.userinfo = res.data.data.userinfo;
					setTimeout(() => {
						uni.hideLoading();
					}, 300);
				})
			},
			loadData:function(){
				//获取基础参数
				// uni.showLoading({
				// 	title:"数据加载中",
				// 	mask:true
				// })
				var info = uni.getStorageSync("userinfo");
				let timestamp = this.helper.now();
				let sign = this.helper.setSign(['token='+info.token,'timestamp='+timestamp]);
				this.helper.req({
					api:"getYuebao",
					timestamp:timestamp,
					data:{token:info.token},
					header:{sign:sign},
					method:'GET',
				}).then(res=>{
					this.user_yuebao = res.data.data.user_yuebao;

					setTimeout(() => {
						uni.hideLoading();
					}, 300);
				})
			},
			navToUrl: function(url) {
				return uni.navigateTo({
					url: url
				});
			}
		},
	};
</script>

<style lang="scss">
page {
    background-color: #fff;
}
.vip-card-box {
    height: 500upx;
    border-radius: 16upx;
    overflow: hidden;
    position: relative;
    padding: 0 20upx 24upx;
	margin: 0upx 30upx 0;
	line-height: 50upx;
    z-index: 10
}
.vip-card-box .grid {
    background-color: initial;
    margin: -20upx -24upx
}
.vip-card-box .grid .iconfont.icon-gongzi {
    font-size: 60upx
}
.vip-card-box .card-bg {
    position: absolute;
    top: 0upx;
    right: 0;
    width: 100%;
    height: 260upx;
    z-index: 0
}
.vip-card-box .b-btn {
    position: absolute;
    right: 20upx;
    top: 16upx;
    height: 40upx;
    text-align: center;
    line-height: 40upx;
    font-size: 22upx;
    z-index: 9
}
.vip-card-box .tit {
    font-size: 24upx;
    line-height: 32upx;
    color: #fff;
    margin-bottom: 28upx;
    z-index: 1
}
.vip-card-box .tit .cuIcon-choiceness {
    font-size: 24upx;
    padding-right: 20upx;
    color: #fff000
}
.vip-card-box .e-b {
    font-size: 28upx;
    color: #fff;
    margin-top: 10upx;
    z-index: 1
}
.vip-card-box .e-m {
    z-index: 1
}
.cu-list.menu>.cu-item {
    color: #333
}
.cu-list.menu>.cu-item .content {
    font-size: 28upx
}
.cu-list.menu>.cu-item .content uni-text[class*=cuIcon] {
    width: auto;
    font-size: 28upx
}
.cu-list.grid>.cu-item uni-text {
    font-size: 28upx;
    color: #333
}
.icon_task{
	width: 100upx;
	height: 100upx;
	margin: 0 auto;
}
uni-button {
    font-size: 24upx;
	padding: 10upx 100upx;
}
.vip-card-box .grid.conbot{
	margin-top: 50upx;
	margin-bottom: 30upx;
}
button{
	border: 2upx solid;
	font-size: 30upx;
	padding: 10upx 100upx;
	line-height: 60upx
}

</style>
